<template>
  <div :class="classes" :style="listStyle">
    <div :class="prefixCls + '-header'">
      <!-- <Checkbox
        :checkboxLabel="''"
        v-model="checkedAll"
        :disabled="checkedAllDisabled"
        @change="toggleSelectAll" /> -->
      <!-- 上面是旧代码，为了极致的性能体验将4层的checkbox优化成1层span，详情参考fakeCheckbox声明 -->
      <FakeCheckbox
        v-model="checkedAll"
        :disabled="checkedAllDisabled"
        @change="toggleSelectAll" />
      <span :class="prefixCls + '-header-title'" @click="toggleSelectAll(getCheckedAll())" v-text="title"></span>
      <span :class="prefixCls + '-header-count'" v-text="count"></span>
    </div>
    <div :class="bodyClasses">
      <div :class="prefixCls + '-body-search-wrapper'" v-if="filterable">
        <aty-input
          :value="query"
          icon="ios-search"
          size="small"
          :placeholder="filterPlaceholder"
          @input="handleQueryChange"
          :clearable="true" />
      </div>
      <ul :class="prefixCls + '-content'">
        <li v-for="(item, index) in filterData"
            :class="itemClasses(item)"
            :key="index"
            @click.prevent="select(item)">
          <!-- <Checkbox
            :checkboxLabel="''"
            :code="item.code"
            :checked="isCheck(item)"
            :disabled="item.disabled" /> -->
          <!-- 上面是旧代码，为了极致的性能体验将4层的checkbox优化成1层span，详情参考fakeCheckbox声明 -->
          <FakeCheckbox
            :checked="isCheck(item)"
            :disabled="item.disabled" />
          <span v-html="showLabel(item)"></span>
        </li>
        <li :class="prefixCls + '-content-not-found'" v-text="notFoundText"></li>
      </ul>

    </div>
    <div :class="prefixCls + '-footer'" v-if="showFooter"><slot></slot></div>
  </div>
</template>
<script type="text/ecmascript-6"  src="./index.js"></script>
